import {useMemo} from "react";
import {types, flow} from "mobx-state-tree";
import {fetchDevices, createSync, deleteSync, fetchSync, openSync, updateSync} from "../api/api";
import SyncModel from "../models/sync";
import {message} from "antd";
import {runInAction} from "mobx";

interface RootStore {
    [key: string]: any,
}


const RootStore = types
    .model({
        dataList: types.array(SyncModel),
        loading: types.boolean,
        showModal: types.boolean,
        currentRecord: types.union(SyncModel, types.null)
    })
    .actions(self => {
        return ({
            changeLoading(loading: boolean) {
                self.loading = loading;
            },
            openModal(showModal: boolean, record: any = null) {
                console.log('openModal==>', showModal, record);
                self.showModal = showModal;
                self.currentRecord = record;
            },
            fetchSyncs: flow(function* () {
                runInAction(() => {
                    self.loading = true;
                    self.dataList.clear();
                })
                const result = yield fetchSync();

                runInAction(() => {
                    result.forEach((sync: any) => {
                        return self.dataList.push(sync);
                    });
                    self.loading = false;
                })
            }),
            openSync: flow(function* () {
                runInAction(() => {
                    self.loading = true;
                })
                yield openSync({});

                runInAction(() => {
                    self.loading = false;
                })
            }),
            createSync: flow(function* (values) {
                runInAction(() => {
                    self.loading = true;
                    self.currentRecord = null;
                })
                const result = yield createSync(values);
                runInAction(() => {
                    self.dataList.push(result);
                    self.loading = false;
                    self.showModal = false;
                    self.currentRecord = null;
                })
                message.success('新增成功', 1);
            }),
            updateSync: flow(function* (id: number, values) {
                runInAction(() => {
                    self.loading = true;
                })
                yield updateSync(id, values);
                message.success('更新成功', 1);
                runInAction(() => {
                    const current: any = self.dataList.find(it => it.id == id);
                    self.dataList.remove(current);
                    const newObj = {...current, ...values};
                    self.dataList.unshift(newObj);

                    self.loading = false;
                    self.showModal = false;
                })
            }),
            deleteSync: flow(function* (id: number) {
                runInAction(() => {
                    self.loading = true;
                });
                yield deleteSync(id);
                runInAction(() => {
                    const current: any = self.dataList.find(it => it.id == id);
                    self.dataList.remove(current);
                    self.loading = false;
                    message.success('删除成功', 1);
                })
            })
        });
    })
    .views(self => ({
        // Mobx计算属性的应用
        get syncCount() {
            return self.dataList.length;
        }
    }));

let _store: RootStore;
export const SyncStore = () => {
    const store = useMemo(() => {
        if (!_store) {
            _store = RootStore.create({
                dataList: [],
                loading: false,
                showModal: false,
                currentRecord: null
            });
        }
        return _store;
    }, []);

    return store;
};
